<template>
	<om-addpage :menuName="menuName" :busCode="busCode" @formSubmit="formSubmit" :customAddFunc="true" :showHistoryBtn="false">
		<view v-show="false">
			<input v-model="formdata.formId" name="formId" />
		</view>
		<uni-list title="社保信息">
			<uni-list-item  :showArrow="true">
				<view class="tui-flex">
					<view class="tui-col-7"><om-label label="生效月份" required></om-label></view>
					<view class="tui-left  tui-col-8">
						<picker mode="date" 
							@change="bindDateChange" 
							:fields="'month'" 
							name="effectMonth" 
							v-model="formdata.effectMonth"
							:value="formdata.effectMonth"
							:end="maxMonth"
							:start="minMonth"
							>
							<view>{{formdata.effectMonth.trim()?formdata.effectMonth:"请选择"}}</view>
						</picker>
					</view>
				</view>
			</uni-list-item>
		</uni-list>
	</om-addpage>
</template>

<script>
import dateTimePicker from '@/static/js/dateTimePicker.js';
import { ignoreHtml } from '@/static/js/common.js';
import moment from '@/static/js/moment.js'
import { mapState } from 'pinia';
import {useLoginUserStore} from '@/stores/login-user.js';
export default {
	provide() {
		return {
			formPage: this
		};
	},
	data() {
		return {
			formdata: {
				effectMonth: dateTimePicker.getNewMonth(),
				formId:"",
				selfAmount:""
			},
			menuName: '',
			busCode: '',
			itemName:'',
			maxMonth:"",
			minMonth:""
		};
	},
	computed: {
		...mapState(useLoginUserStore, ['userName', 'userId'])
	},
	methods: {
		switchChange(){
			this.formdata.thirdFlag = !this.formdata.thirdFlag
		},
		getEffectMonthList(){
			let _that = this
			_that.om.request(
				"thousingFund/getEffectMonthList",
				{
					ztime:_that.ztime
				}
			).then(res=>{
				if(res.length){
					_that.minMonth = res[0].value
					_that.maxMonth= res[res.length-1].value
				}else{
					_that.maxMonth = moment().add(2,'months').format('YYYY-MM')
					_that.minMonth = moment().subtract(2,'months').format('YYYY-MM')
				}
			})
		},
		onKeyInput(event){
			let _that = this
			if(event.target.value != null){
				_that.formdata.selfAmount = event.target.value
			}
			
		},
		
		/**
		 * 生效日期
		 */
		bindDateChange(e) {
			if(moment(e.detail.value).isSameOrAfter(this.minMonth) && moment(e.detail.value).isSameOrBefore(this.minMonth))
			{
				this.formdata.effectMonth = e.detail.value;
			}else{
				this.om.toast('请选择'+ this.minMonth +'到'+ this.maxMonth+'之间的日月份')
			}
		},
		formSubmit: function(formdata) {
			let _that = this;
			if(!formdata || Object.keys(formdata).length==0){
				formdata = _that.formdata
			}
			if(!formdata.formId ){
				_that.om.toast('没有找到对应表单标识');
				return;
			}
			_that.om.request(
				'tsocialSecurityApply/updateData',
				{
					id:_that.formdata.formId,
					selfAmount:_that.formdata.selfAmount?_that.formdata.selfAmount:'',
					effectMonth:_that.formdata.effectMonth
				},
				'post'
			).then(res=>{
					_that.om.getFormInfo(_that.formdata.formId, _that.busCode, true)
			})
		},
	},
	onLoad: function(options) {
		let _that = this;
		_that.menuName = options.title || '社保';
		uni.setNavigationBarTitle({
			title: _that.menuName
		});
		if(options.code){
			_that.busCode = options.code
		}else{
			_that.om.toast("没有表单编码")
		}
		if(options.fileId){
			_that.formdata.formId = options.fileId
		}else{
			_that.om.toast("没有表单ID")
		}
		let obj = {
			code:options.code
		}
		let obj2 ={
			id:options.fileId
		}
		_that.om.request(
		"formFieldConfig/showPage",
		obj
		).then(res=>{
			if(res.succeed){
				if(res.value){
					_that.itemName = res.value.body1[2].itemName
				}
			}else{
				_that.om.toast(res.msg)
			}
		})
		_that.om.request(
		"tsocialSecurityApply/getInfo",
		obj2
		).then(res=>{
			if(res.succeed){
				if(res.value){
					_that.formdata.selfAmount = res.value.t.selfAmount
					_that.ztime = res.value.t.ztime
					_that.getEffectMonthList()
					if(res.value.t.effectMonth){
						_that.formdata.effectMonth = res.value.t.effectMonth
					}else{
						_that.formdata.effectMonth = dateTimePicker.getNewMonth()
					}
				}
			}
		})
	}
};
</script>

<style></style>
